* {
    margin: 0;
    padding: 0;
}

html,
body {
    height: 100%;
    overflow: hidden;
}

.center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* 具体样式 */
#root {
    .center;
    width: 300px;
    height: 300px;
    background: lightblue;
}

.outer {
    .center;
    width: 200px;
    height: 200px;
    background: lightgreen;
}

.inner {
    .center;
    width: 100px;
    height: 100px;
    background: lightcoral;
}